<template>
	<view class="auth-app">
		<view class="tip">
			<view>数字水体治理</view>
			<!--
			<view style="font-size:32upx;margin-top:10upx;">RV NEW JOURNEY</view>
			-->
		</view>
		<view class="form" style="position:relative;">
			<!--
			<view class="field">
				<input class="input" v-model="form.username" type="text" placeholder="请输入用户名" name="nameValue" />
			</view>
			<view class="field">
				<input class="input" type="password" v-model="form.password" placeholder="请输入密码" />
			</view>
			-->
			<view class="field">
				<input class="input" v-model="form.mobile" type="text" placeholder="请输入手机号码" />
			</view>
			<view class="field">
				<input class="input" v-model="form.code" type="text" placeholder="请输入验证码" />
			</view>
			<!--
			<view class="field">
				<input class="input" v-model="form.discountCode" type="text" placeholder="请输入优惠码(选填)" />
			</view>
			-->
			<view style="width:250upx;position: absolute;right: 20upx;top: 112upx;z-index: 2;">
				<code-button @setError="setCodeFormError" action="1" :phone="form.mobile" />
			</view>
			<view class="button-view" style="margin-top: 20upx;">
				<button open-type="getUserInfo" @getuserinfo="bindGetUserInfo" class="btn btn-primary btn-big register" hover-class="hover" style="margin-top:20upx;padding: 5upx;">登录</button>
				<!--
				<view class="btn btn-primary btn-big register" hover-class="hover" @click="submit">注册</view>
				-->
				<!--
				<text style="color:#175199;float:right;margin-right:25upx;margin-top: 20upx;"  @click="goLogin">返回登录</text>
				-->
			</view>
		</view>
	</view>
</template>

<script>
	import CodeButton from '@/components/code-button.vue'

	export default {
		data() {
			return {
				form: {
					error: '',
					username: '',
					password: '',
					confirm_password: '',
					mobile: '',
					code: '',
					discountCode: '',
					submit: false
				},
			};
		},
		onLoad(params) {

		},
		mounted() {
			let discountCode = uni.getStorageSync('reg_discount_code');
			this.form.discountCode = discountCode
		},
		components: {
			CodeButton
		},
		methods: {
			goLogin() {
				this.$emit('show', 'login')
			},
			setCodeFormError(error) {
				if (error) {
					uni.showToast({
						icon: "none",
						title: error,
						duration: 2000
					});
				}
			},
			bindGetUserInfo(e) {
				if (e.detail.userInfo) {
					this.submit(e)
				} else {
					this.$Message.error('用户信息不存在')
				}
			},
			submit(e) {
				if (this.form.mobile.length == 0) {
					this.$Message.error('手机号码不能为空')
				} else {
					var wxToken = uni.getStorageSync('wx_token');
					uni.showLoading({
						title: '注册中'
					});
					this.$api.post('/app/user/auth/register', {
						mobile: this.form.mobile,
						code: this.form.code,
						discountCode: this.form.discountCode,
						wxToken: wxToken
					}).then((response) => {
						if (response.code == 0) {
							global.setToken(response.data.token)
							//this.$store.commit('setGlobalToken', response.data.token)
							//this.$emit('setGlobalUserInfo', response.data)
							//this.$store.commit('setGlobalUserInfo', response.data)
							this.$Message.success('注册成功')
							
							//更新用户信息，不存在时直接注册
							this.$api.post('/app/user/auth/updateInfo',{
								code: global.getWxCode(),
								rawData: e.detail.rawData,
								signature: e.detail.signature,
								encryptedData: e.detail.encryptedData,
								iv: e.detail.iv,
								userInfo: e.detail.userInfo
							}).then((response) => {
								
							})
							
							uni.navigateTo({
								url: '/pages/user/auth/vip?isReg=1'
								//url: "/pages/tour/product/detail"
							});
							
							/*
							uni.navigateBack({
								delta: 1
							});
							*/
						} else {
							this.$Message.error(response.msg)
						}
						this.form.submit = false
						uni.hideLoading()
					})
				}

			}

		}
	}
</script>

<style lang="scss">
	/* 登录 */
	.auth-app {
		font-size: $uni-font-size-base;
		.tip{
			background-color: #1D2C6D;
			height: 300upx;
			font-size:60upx;
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			color: white;
			margin-bottom:10upx;
		}
		.tabs {
			display: flex;
			font-size: 38upx;
			height: 80upx;
			margin-top: 20upx;
			border-bottom: 3upx solid #ccc;
			margin-bottom: 20upx;

			.tab-item {
				text-align: center;
				width: 50%;
			}

			.current {
				border-bottom: 1upx solid #2d8cf0;
				color: #2d8cf0;
			}
		}

		.loginView {
			display: flex;
			flex: 1;
			flex-direction: column;
			width: 750upx;
			min-height: 100vh;
			padding-top: 30upx;
		}

		.field {
			border-bottom-style: solid;
			border-bottom-width: 1upx;
			border-bottom-color: #ddd;
			background-color: #fff;
			flex-direction: row;
			width: 750upx;
			padding: 20upx 20upx;
			box-sizing: border-box;
		}

		.input {
			flex: 1;
			height: 60upx;
			/*font-size: 32upx;*/
			align-items: center;
		}

		.actions {
			width: 750upx;
			margin-top: 50upx;
			padding: 0 20upx;
			box-sizing: border-box;
			flex-direction: column;
		}

		.login {
			background-color: #23cf5f;
			color: #fff;
		}

		.register {
			margin-top: 30upx;
			color: white;
			border-color: #23cf5f;
			border-width: 2upx;
			width: 660upx;
			margin:0 auto;
			font-size: $uni-font-size-lg;
		}

		.register.hover,
		.login.hover {
			opacity: 0.6;
		}
	}
</style>
